<template>
	<view>
		<!-- <u-swiper :list="products.imgtext" height="704" mode="number" indicator-pos="bottomRight"></u-swiper> -->
		<view class="relative w-1 fl-c">
			<swiper class="swiper" autoplay :interval="2000" :duration="500" circular @change="changeBanner">
				<swiper-item v-for="(item, index) in banner" :key="index">
					<block>
						<image :src="item" mode="aspectFill" class="w-1 h-1"></image>
					</block>
				</swiper-item>
			</swiper>
			<view class="w-1 fr-c dots fm-ali">
				<text>{{ curbanner + 1 }}/{{ banner.length }}</text>
			</view>
		</view>

		<view class="w-1 fl-s-s" style="padding: 28rpx 32rpx; background: #ffffff">
			<view class="fr-b-c w-1">
				<view class="fr-s-c fm-ali" style="color: #fa360a; align-items: baseline">
					<text class="fs-28">￥</text>
					<text class="fs-48">{{ info.c_original_price }}</text>
				
				</view>
				
			</view>
			<text class="fs-32 c-00 fm-ali" style="margin-top: 15rpx">{{ products.c_brand_name }}</text>
			
		</view>
		<u-gap height="12" bg-color="#f4f4f4"></u-gap>
		<!-- <block v-if="choosed">
			<view class="fr-b-c p-r-30" @click="chooseShow(0)" style="height: 75rpx; background: #ffffff">
				<view class="fr-s-c">
					<text class="fs-28 c-00 fm-ali">选择</text>
					<text class="m-l-40 flex-1 text-line-1 c-99 fs-28 fm-ali">{{ choosed }}</text>
				</view>
				<image src="/static/images/user/right_arr_icon.png" style="width: 11rpx; height: 16rpx"></image>
			</view>
			<u-gap height="12" bg-color="#f4f4f4"></u-gap>
		</block> -->
		<!-- v-if="mch_info" -->
		<!-- <view class="dianpu" v-if="info.shop_goods">
			<view class="dianpu_left">
				<image :src="baseUrl.cdnurl + info.shop_goods.avatar" class="dianpu_left_img" mode=""></image>
				<view class="dianpu_left_title">
					{{ info.shop_goods.shopname }}
				</view>
			</view>
			<view class="dianpu_right" @click="toMerchantMerchandise">
				<view class="dianpu_right-text">进入店铺</view>
				<image src="/static/images/home/Subtract@2x.png" class="dianpu_right_img" mode=""></image>
			</view>
		</view> -->
		<!-- 评论部分 -->
		<!-- <view class="fl-s-s" style="padding: 28rpx 32rpx; background: #ffffff" v-if="products.evaluate_first">
			<view class="fr-b-c fm-ali w-1">
				<view class="fr-s-c">
					<image src="/static/images/home/goods_detail_comment.png" style="width: 23rpx; height: 23rpx"></image>
					<text class="m-l-10 fs-28 c-00">评价{{ products.evaluate_total }}</text>
				</view>
				<view class="fr-s-c" @click="toCommentList">
					<text class="fs-28 c-99" style="margin-right: 6rpx">好评率{{ products.favorable_rate }}%</text>
					<image src="/static/images/user/right_arr_icon.png" style="width: 11rpx; height: 16rpx"></image>
				</view>
			</view> -->
			<!-- 评论标签 -->
			<!-- <view class="fr-s-s w-1 m-t-30" style="background: #ffffff; flex-wrap: wrap">
				<view class="label-item m-r-20 m-b-20 fr-c" v-for="(item, index) in labelTabs" :key="index">{{ item.text }}({{ item.num }})</view>
			</view> -->
			<!-- <view class="w-1 fl-s-s">
				<view class="comment-item w-1 fl-s-s" @click="toComment">
					<view class="fr-s-c w-1">
						<image :src="products.evaluate_first.avatar" mode="aspectFill" class="circle" style="width: 56rpx; height: 56rpx"></image>
						<view class="flex-1 fl-c-s m-l-20">
							<view class="fr-b-c w-1 fm-ali">
								<text class="fs-20 c-66">{{ products.evaluate_first.nickname }}</text>
								<text class="fs-22 c-99">{{ products.evaluate_first.creattime }}</text>
							</view>
							<view class="fr-s-c" style="margin-top: 5rpx">
								<image
									v-for="item in products.evaluate_first.star_level"
									:key="this"
									class="m-r-10"
									src="/static/images/home/comment_stars.png"
									style="width: 19rpx; height: 19rpx"
								></image>
								<image
									v-for="item in 5 - products.evaluate_first.star_level"
									:key="this"
									class="m-r-10"
									src="/static/images/home/comment_star.png"
									style="width: 19rpx; height: 19rpx"
								></image>
							</view>
						</view>
					</view>
					<text style="word-break: break-all" class="m-t-30 fs-26 c-66 fm-ali">{{ products.evaluate_first.content }}</text>
					
					<view class="fr-s-s w-1 m-t-30" style="flex-wrap: wrap">
						<image :src="item" v-for="(item, index) in products.evaluate_first.imgs" :key="index" mode="aspectFill" class="comment-image"></image>
					</view>
					
					<view class="reply-box w-1 m-t-20" v-if="products.evaluate_first.replay.length">
						<view class="fr-s-s" v-for="(item, index) in products.evaluate_first.replay" :key="index">
							<text class="c-33 fm-ali fs-24">
								{{ item.user.nickname }}回复：
								<text class="c-99 fm-ali fs-24">{{ item.content }}</text>
							</text>
						</view>
					</view>
				</view>
			</view>
		</view> -->
		<!-- <u-gap height="12" bg-color="#f4f4f4"></u-gap> -->
		
		<!-- <u-gap height="12" bg-color="#f4f4f4" v-if="mch_info"></u-gap> -->
		<!-- 详情 -->
		<view class="fl-s-s" style="padding: 28rpx 32rpx; background: #ffffff">
			<view class="fr-s-c">
				<image src="/static/images/home/intro_goods_detail.png" style="width: 22rpx; height: 25rpx"></image>
				<text class="m-l-10 fs-28 c-00 fm-ali">商品介绍</text>
			</view>
			<u-parse class="m-t-30" :html="info.c_goods_content"></u-parse>
		</view>
		<!-- 底部按钮 -->
		<view class="iphonex" style="background: #ffffff">
			<view class="w-1 fr-b-c p-r-30" style="height: 104rpx">
				
				<view class="new_icon">
					<!-- <view class="new_icon_icon_view" @tap="toChat(info.shop_id, { id: info.id, title: info.title, image: info.image, price: info.price })">
						<image class="icon_shop" style="width: 20px" src="/static/images/home/kefu.png" mode="widthFix"></image>
						<view class="new_icon_icon_text">客服</view>
					</view> -->
					<view class="new_icon_icon_view" @tap="go_ShoppingCart">
						<view class="cu-tag badge" v-if="cart.cartnum > 0">{{ cart.cartnum }}</view>
						<image class="icon_shop" style="width: 20px" src="/static/images/home/cart.png" mode="widthFix"></image>
						<view class="new_icon_icon_text">购物车</view>
					</view>
				</view>
				<view class="fr-c">
					<view class="add-cart-btn fr-c" @click="dealAddcar">加入购物车</view>
					<view class="buy-btn fr-c" @click="toPurchase">立即购买</view>
				</view>
			</view>
		</view>
		<u-popup closeable border-radius="24" safe-area-inset-bottom v-model="show" :closeable="false" mode="bottom">
			<view class="w-1" style="height: 1074rpx; background-color: transparent; padding-top: 90rpx">
				<view class="fl-s-s relative w-1" style="padding: 28rpx 32rpx; height: 974rpx; background: #ffffff; border-radius: 24rpx">
					<view class="fr-s-s relative" style="height: 132rpx; width: 622rpx">
						<image
							:src="info.goods_sku[goods_sku_index].c_goods_image"
							class="relative"
							mode="aspectFill"
							style="border: 4rpx solid #f4f4f4; z-index: 999; margin-top: -90rpx; width: 212rpx; height: 212rpx; border-radius: 12rpx"
						></image>
						<view class="flex-1 fl-s-s fm-ali m-l-20">
							<view class="fr-s-c fm-ali" style="color: #fa360a; align-items: baseline">
								<text class="fs-24">￥</text>
								<text class="fs-36">{{ info.goods_sku[goods_sku_index].c_original_price }}</text>
							</view>
							<text class="text-line-2 c-66 fs-24">
								【已选】{{ info.goods_sku[goods_sku_index].c_goods_name }}，数量{{ value }}
							</text>
							<view >
								<text class="text-line-2 c-66 fs-24">库存{{ info.goods_sku[goods_sku_index].c_goods_stock_valid }}</text>
							</view>
						</view>
					</view>
					<image src="/static/images/user/close_pup.png" @click="show = false" class="absolute" style="right: 32rpx; top: 32rpx; height: 22rpx; width: 22rpx"></image>
					<scroll-view scroll-y class="w-1 m-t-50" style="height: 520rpx; margin-top: 48rpx">
						<view class="fl-s-s fm-ali" v-for="(item, index) in info.goods_sku" :key="index">
							<!-- <text class="c-33 fs-28">{{ item.name }}</text> -->
							<view class="fr-s-s w-1" style="background: #ffffff; flex-wrap: wrap">
								<view
									@click="changeLabel(index)"
									class="m-r-20 m-b-20 fr-c"
									:class="item.toggle ? 'gg-act' : 'gg-item'"
								>
									{{ item.c_goods_name }}
								</view>
							</view>
						</view>
					</scroll-view>
					<view class="fr-b-c fm-ali w-1">
						<text class="c-33 fs-28">数量</text>
						<u-number-box :min="1" :max="Number(info.goods_sku[goods_sku_index].c_buy_max_num)" :disabled-input="true" v-model="value" @change="valChange" bg-color="transparent"></u-number-box>
					</view>
					<view class="iphonex" style="background: #ffffff">
						<view class="sure-btn fr-c" @click="clickSure">确定</view>
					</view>
				</view>
			</view>
		</u-popup>
		<!-- 视频播放弹窗 -->
		<u-mask :show="videoshow" class="fl-c" @click="videoshow = false">
			<video v-if="videoshow" autoplay style="width: 600rpx; height: 600rpx" :src="products.video"></video>
		</u-mask>
		
	</view>
</template>

<script>
import { pointsPrice } from '@/utils/util.js';
import config from '@/utils/base.js';
import { mapState, mapActions } from 'vuex';
export default {
	data() {
		return {
			list: [],
			labelTabs: [
				{
					text: '全部评价',
					num: '0'
				},
				{
					text: '好评',
					num: '0'
				},
				{
					text: '中评',
					num: '0'
				},
				{
					text: '差评',
					num: '0'
				}
			],
			content: '',
			show: false,
			showType: 0, // 0 点击选择弹出 1 加购物车弹出 2 立即购买弹出
			curlabel: 0,
			value: 1,
			scrollTop: 0,
			id: 0, // 商品id
			shouc: 1, // 1 未收藏 2已收藏
			products: '', // 接口返回产品信息
			mygrouparr: [], // 规格数组
			proinfo: '', // 调取规格接口后返回的数据
			info_content: '',
			mch_info: '', // 商家信息
			curbanner: 0,
			videoshow: false,
			info: '',
			baseUrl: config,
			// sku_index: 0,
			spu: [],
			selectshop: {}, //存放最后选中的商品
			stock: '',
			f_index: 0,
			z_index: 0,
			arr: [],
			sku_id: '',
			sku: [],
			platform:'',
			c_father_goods_id:'',
			banner:[],
			goods_sku_index:0,
		};
	},
	onLoad(e) {
		this.id = e.id || 0;
		
		this.platform = e.platform || 0;
		this.c_father_goods_id = e.c_father_goods_id || 0;
		console.log(this.platform)
		// this.getLabel()
		// this.getInfoContent()
		this.getInfo();
	},
	onNavigationBarButtonTap(e) {
		this.shareImage();
	},

	filters: {
		pointsPrice
	},
	// 计算属性
	computed: {
		// 选的规格
		choosed() {
			let mygrouparr = this.mygrouparr;
			let arr = [];
			mygrouparr.map((item) => {
				item.item.map((items) => {
					if (items.toggle) {
						arr.push(items.name);
					}
				});
			});
			return arr.join(',');
		},
		// 商品价格
		// goodsPrice() {
		// 	if (!this.proinfo) {
		// 		return this.products.price;
		// 	} else {
		// 		return this.proinfo.price;
		// 	}
		// },
		// 总价 合计
		// totalPrice() {
		// 	if (!this.proinfo) {
		// 		return this.products.price * this.value
		// 	} else {
		// 		return this.proinfo.price * this.value
		// 	}
		// },
		price() {
			return 0;
			// if (this.info) {
			// 	if (Object.keys(this.info.sku).length > 0) {
			// 		return this.value * Number(this.info.sku[this.f_index].price) + '.00';
			// 	} else {
			// 		
			// 	}
			// }
		},
		...mapState(['cart', 'common'])
	},
	watch: {
		mygrouparr: {
			deep: true, //true为进行深度监听,false为不进行深度监听
			handler(val) {
				// console.log(val, 'nnnnnnnnn');
				let length = val.length;
				let arr = [];
				val.map((item) => {
					item.item.map((items) => {
						if (items.toggle) {
							arr.push(items.name);
						}
					});
				});
				// if(arr.length==length){
				// 	// this.getGgInfo(arr.join(','))
				// }
			}
		},

		price(n, o) {
			if (n != o) {
				// 更新一次优惠券
				this.queryCoupon(n);
			}
		}
	},
	methods: {
		checkTv(img) {
			let index = img.lastIndexOf('.');
			let type = img.substring(index); //截断"."之前的，得到后缀
			console.log(type);
			if (type != '.mp4' && type != '.rmvb' && type != '.avi' && type != '.ts') {
				//根据后缀，判断是否符合视频格式
				return false;
			}
		},

		async loadStock(sku_id) {
			this.$api.get({
				url: '/wanlshop/product/stock',
				data: {
					sku_id: sku_id
				},
				success: (res) => {
					// console.log(res)
					this.stock = res.data;
					// console.log(this.stock)
				}
			});
		},
		go_ShoppingCart() {
			uni.switchTab({
				url: '/pages/ShoppingCart/ShoppingCart'
			});
		},
		// 切换banner
		changeBanner({ detail }) {
			let { current } = detail;
			this.curbanner = current;
		},

		async queryCoupon(price) {
			this.$api.post({
				url: '/wanlshop/coupon/query',
				data: {
					shop_id: this.info.shop_id,
					goods_id: this.info.id,
					shop_category_id: this.info.shop_category_id,
					price: price
				},
				success: (res) => {
					console.log(res);
					// this.info.coupon = res.data;
				}
			});
		},
		toCommentList() {
			uni.navigateTo({
				url: '/pages/Home/GoodsDetail/CommentList/CommentList?id=' + this.id
			});
		},
		// 处理弹出规格框
		chooseShow(n) {
			this.showType = n;
			console.log(this.showType);
			this.show = true;
		},
		// 点击弹窗中的确定按钮
		clickSure() {
			if(!this.c_father_goods_id){
				uni.showToast({
					title:'请选择商品规格',
					icon:'none'
				})
				return false
			}
			let goodsData = [{
				goods_id: this.info.c_id,
				number: this.value,
				sku_id: this.info.goods_sku[this.goods_sku_index].c_goods_id,
				c_original_price:this.info.goods_sku[this.goods_sku_index].c_original_price,
				platform:this.platform
			}];
			if(parseInt(this.value) > parseInt(this.info.goods_sku[this.goods_sku_index].c_goods_stock_valid)){
				uni.showToast({
					title:'库存不足，请重新选择',
					icon:'none'
				})
				return false
			}
			
			uni.redirectTo({
				url: `/pages/Home/GoodsDetail/EnsureOrder/EnsureOrder_new/EnsureOrder_new?order_type=groups&data=${JSON.stringify(goodsData)}&platform=${this.platform}`
			});
			
		},
		// 获取规格信息
		getGgInfo(str) {
			console.log(str);
			this.$get({
				url: '/MainWxapp/doPageGuigeInfo',
				data: {
					id: this.id,
					str
				}
			}).then((res) => {
				console.log(res, '+++');
				this.proinfo = res.data.data.proinfo;
			});
		},
		// 处理加入购物车
		dealAddcar() {
			if (!uni.getStorageSync('user_id')) {
				uni.navigateTo({
					url: '/pages/Login/Login'
				});
				return;
			}
			if (this.products.use_more == 2) {
				// 单规格 直接加购物车  最后一个参数 单规格为-1  多规格为接口返回的
				this.addCard(this.id, 1, -1);
			} else {
				// 多规格
				this.chooseShow(1);
			}
		},
		// 分享商品图片
		shareImage() {
			uni.showLoading({
				title: '请稍等'
			});
			uni.share({
				provider: 'weixin',
				scene: 'WXSceneSession',
				type: 2,
				imageUrl: this.products.shareimg,
				success: (res) => {
					console.log('success:' + JSON.stringify(res));
				},
				fail: (err) => {
					this.$u.toast('分享失败');
					console.log('fail:' + JSON.stringify(err));
				},
				complete: () => {
					uni.hideLoading();
				}
			});
		},
		// 加入购物车
		addCard() {
			if (this.$store.state.user.isLogin) {
				console.log(this.stock);
				if (!this.stock) {
					uni.showToast({
						title: '请选择规格',
						icon: 'none'
					});
					return false;
				}
				if (this.stock <= 0) {
					uni.showToast({
						title: '商品库存不足，请重新选择',
						icon: 'none'
					});
					return false;
				}
				this.$store.dispatch('cart/add', {
					shop_id: this.info.shop_id,
					shop_name: this.info.shop_goods.shopname,
					goods_id: this.info.id,
					title: this.info.title,
					number: this.value,
					image: this.info.image,
					sku: this.sku,
					sku_id: this.sku_id,
					sum: this.$wanlshop.bcmul(this.sku.price, this.value)
				});
				this.$wanlshop.msg('已加购物车');
				// uni.redirectTo({
				// 	url: `/pages/Home/GoodsDetail/EnsureOrder/EnsureOrder?order_type=groups&data=${JSON.stringify(goodsData)}`
				// });
			} else {
				uni.reLaunch({
					url: '/pages/Login/Login'
				});
			}
		},
		// 收藏 取消收藏
		opCollect() {
			if (!uni.getStorageSync('user_id')) {
				uni.navigateTo({
					url: '/pages/Login/Login'
				});
				return;
			}
			this.$post({
				url: '/Wxapps/doPageCollect',
				data: {
					types: 'showProMore',
					id: this.id
				}
			}).then((res) => {
				console.log(res, '+++');
				this.shouc = this.shouc == 1 ? 2 : 1;
				this.$u.toast(res.msg);
			});
		},
		// 获取商品详情
		getInfo() {
			let that = this;
			console.log(that.platform)
			that.$get({
				url: '/wanlshop/product/goods',
				data: {
					id: that.id,
					platform:that.platform,
					c_father_goods_id:that.c_father_goods_id
				}
			}).then((res) => {
				console.log(res)
				that.info = res.data;
				that.banner = that.info.c_banner_images.split(";");
				console.log(that.banner)
				if (that.info.goods_sku) {
					for (let i in that.info.goods_sku) {
							that.$set(that.info.goods_sku[i],'toggle', false);
					}
				}
			});
		},
		changeLabel(index) {
			this.goods_sku_index = index
			for(let i in  this.info.goods_sku){
				this.info.goods_sku[i].toggle = false
			}
			this.$set(this.info.goods_sku[index],'toggle',true)
			this.c_father_goods_id = this.info.goods_sku[index].c_father_goods_id
			
		},
		// 去评论
		toComment() {
			let item = encodeURIComponent(JSON.stringify(this.products.evaluate_first));
			uni.navigateTo({
				url: '/pages/Home/GoodsDetail/Comment/ReplyComments/ReplyComments?info=' + item
			});
		},
		valChange(e) {
			console.log('当前值为: ' + e.value);
		},
		toPurchase() {
			if (!uni.getStorageSync('user_id')) {
				uni.navigateTo({
					url: '/pages/Login/Login'
				});
				return;
			}
			if (this.products.use_more == 2) {
				// 单规格 直接加购物车  最后一个参数 单规格为-1  多规格为接口返回的
				// this.addCard(this.id,1,-1)
				let buydata = [this.id + '|' + '-1' + '|' + 1];
				uni.navigateTo({
					url: '/pages/Home/GoodsDetail/EnsureOrder/EnsureOrder?buydata=' + encodeURIComponent(JSON.stringify(buydata))
				});
			} else {
				// 多规格
				this.chooseShow(2);
			}
			this.queryCoupon(this.info.price);
		},
		toMerchantMerchandise() {
			uni.navigateTo({
				url: '/pages/Home/MerchantDetails/MerchantDetails?shoop_id=' + this.info.shop_id
			});
		},
		// 查看商品视频
		toPlay() {
			// uni.navigateTo({
			// 	url:"/pages/Home/LivingList/LivingDetail/LivingDetail?src="+encodeURIComponent(this.products.video)
			// })
			this.videoshow = true;
		}
	}
};
</script>

<style>
page {
	padding-bottom: 120rpx;
	background: #f4f4f4;
}
.badge {
	position: absolute;
	top: -10rpx;
	right: 10rpx;
	z-index: 9;
}
>>> .u-indicator-item-number {
	width: 108rpx;
	height: 50rpx;
	background: rgba(0, 0, 0, 0.3);
	border-radius: 25rpx;
	font-size: 28rpx;
	font-family: Alibaba;
	color: #ffffff;
	display: flex;
	justify-content: center;
	align-items: center;
}

>>> .u-numberbox {
	border: 2rpx solid #eeeeee !important;
	width: 130rpx !important;
	height: 42rpx !important;
	border-radius: 6rpx !important;
	font-family: Alibaba !important;
}

>>> .u-number-input {
	font-family: Alibaba;
	font-size: 22rpx;
	color: #000000;
	width: 46rpx !important;
	height: 42rpx !important;
	margin: 0 !important;
	border: none;
	border-radius: 0;
	border-left: 2rpx solid #eeeeee;
	border-right: 2rpx solid #eeeeee;
}

>>> .u-icon-minus {
	width: 42rpx !important;
	height: 42rpx !important;
	color: #c0c0c0 !important;
}

>>> .u-icon-plus {
	width: 42rpx !important;
	height: 42rpx !important;
	color: #c0c0c0 !important;
}

>>> .u-drawer-bottom {
	background-color: transparent !important;
}

.cou-item {
	padding: 0 20rpx;
	font-size: 24rpx;
	font-family: Alibaba;
	color: #fa360a;
	height: 54rpx;
}

.label-item {
	padding: 0 22rpx;
	height: 60rpx;
	background: rgba(250, 54, 10, 0.1);
	border-radius: 32rpx;
	font-size: 24rpx;
	font-family: Alibaba;
	color: #666666;
}

.comment-item {
	padding: 28rpx 0;
	border-bottom: 2rpx solid #f4f4f4;
}

.comment-image {
	width: 164rpx;
	height: 166rpx;
	border-radius: 8rpx;
	margin-right: 10rpx;
	margin-bottom: 10rpx;
}

.reply-box {
	background: #f4f4f4;
	border-radius: 16rpx;
	padding: 28rpx 32rpx;
}

.add-cart-btn {
	width: 192rpx;
	height: 68rpx;
	background: #fa8b0a;
	border-radius: 34rpx;
	font-size: 26rpx;
	font-family: Alibaba;
	color: #ffffff;
}

.buy-btn {
	width: 192rpx;
	height: 68rpx;
	background: #fa360a;
	box-shadow: 0rpx 6rpx 3r2px 2rpx rgba(250, 74, 20, 0.58);
	border-radius: 34rpx;
	font-size: 26rpx;
	font-family: Alibaba;
	color: #ffffff;
	margin-left: 14rpx;
}

.label-item {
	padding: 0 22rpx;
	height: 60rpx;
	background: rgba(250, 54, 10, 0.1);
	border-radius: 32rpx;
	font-size: 24rpx;
	font-family: Alibaba;
	color: #666666;
}

.item-act {
	padding: 0 22rpx;
	height: 60rpx;
	background: rgba(250, 54, 10, 0.1);
	border-radius: 32rpx;
	border: 2rpx solid #fa360a;
	font-size: 24rpx;
	font-family: Alibaba;
	color: #fa360a;
}

.gg-act {
	padding: 0 32rpx;
	/* height: 68rpx; */
	background: #fa360a;
	border-radius: 8rpx;
	font-size: 28rpx;
	font-family: Alibaba;
	color: #ffffff;
	margin-top: 28rpx;
	margin-right: 28rpx;
}

.gg-item {
	margin-top: 28rpx;
	margin-right: 28rpx;
	padding: 0 32rpx;
	/* height: 68rpx; */
	background: rgba(0, 0, 0, 0.05);
	border-radius: 8rpx;
	font-size: 28rpx;
	font-family: Alibaba;
	color: #666666;
}

.sure-btn {
	width: 686rpx;
	height: 100rpx;
	background: linear-gradient(246deg, #fa360a 0%, #fa8c0a 100%);
	box-shadow: 0rpx 6rpx 32rpx 2rpx rgba(250, 74, 20, 0.58);
	border-radius: 50rpx;
	font-size: 32rpx;
	font-family: Alibaba;
	color: #ffffff;
	margin: auto;
	margin-bottom: 30rpx;
}

.swiper {
	height: 750rpx;
	width: 750rpx;
	overflow: hidden;
}

.dots {
	position: absolute;
	right: 20rpx;
	bottom: 20rpx;
	width: 70rpx;
	height: 36rpx;
	background: rgba(0, 0, 0, 0.5);
	font-size: 22rpx;
	color: #ffffff;
	border-radius: 40rpx;
}

.play-btn {
	width: 96rpx;
	height: 96rpx;
	border-radius: 50%;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 9;
}

.yuanjia {
	font-size: 28rpx;
	font-family: Alibaba PuHuiTi 2-55 Regular, Alibaba PuHuiTi 20;
	font-weight: normal;
	color: #999999;
	margin-left: 12rpx;
	text-decoration: line-through;
}

.dianpu {
	width: 100%;
	height: 88rpx;
	background: #ffffff;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 32rpx;
}

.dianpu_left_img {
	width: 34rpx;
	height: 34rpx;
	background-color: aliceblue;
	border-radius: 50%;
	margin-right: 16rpx;
}

.dianpu_left {
	display: flex;
	align-items: center;
	font-size: 26rpx;
	font-family: Alibaba PuHuiTi 2-65 Medium, Alibaba PuHuiTi 20;
	font-weight: normal;
	color: #333333;
}

.dianpu_right {
	display: flex;
	align-items: center;
	font-size: 28rpx;
	font-family: Alibaba PuHuiTi 2-55 Regular, Alibaba PuHuiTi 20;
	font-weight: normal;
	color: #333333;
}

.dianpu_right_img {
	width: 20rpx;
	height: 20rpx;
	margin-left: 12rpx;
}

.new_icon {
	display: flex;
	align-items: center;
}

.new_icon_icon_view {
	width: 100rpx;
	text-align: center;
	margin-right: 20rpx;
	position: relative;
}

.new_icon_icon {
	font-size: 40rpx;
}

.new_icon_icon_view {
	font-size: 20rpx;
	font-family: Alibaba PuHuiTi 2-55 Regular, Alibaba PuHuiTi 20;
	font-weight: normal;
	color: #262626;
}
.icon_shop {
	width: 40rpx;
	height: 40rpx;
}
</style>
